import {ProColumns} from '@ant-design/pro-components';
import { Modal } from 'antd';
import React from 'react';
import {ProTable} from "@ant-design/pro-table/lib";

// 定义属性
export type Props = {
  columns: ProColumns<API.InterfaceInfo>[];
  onCancel: ( ) => void;
  onSubmit: (values:API.InterfaceInfo) => Promise<void>;
  visible: boolean;
 };

/**
 *      Modal模态框（弹出对话框）
 *
 *    <Modal>元素来实现模态框的渲染。
 *    元素的visible属性用于控制模态框的显示/隐藏状态
 *    通过onCancel属性和一个箭头函数绑定了模态框关闭时的回调函数
 *
 * @param props
 * @constructor
 */

const CreateModal: React.FC<Props> = (props) => {
  const {visible,columns,onCancel,onSubmit} = props;
  return (
    <Modal visible = {visible} onCancel={() => onCancel?.()}>
      <ProTable
        type="form"
        columns = {columns}
        onSubmit={async (value) => {onSubmit?.(value);
      }}/>
    </Modal>

  );
};

export default CreateModal;
